$(function() {
    $.ajax({
        type: "get",
        url: "http://chst.vip:1234/api/getcategorytitle"
    }).then((res) => {
        var arr = res.result;
        let html = "";
        arr.forEach(item => {
            html += `
            <ul>
                <li class="shop" titleid=${item.titleId} isclick="false">
                ${item.title}<span class="fr">▼</span>
                </li>
                <li class="shop-li">
                    <ul class="shopList"></ul>
                </li>
            </ul>
            `
        });
        $("#main").html(html)
        $("ul li.shop").click(function() {
            let dom=$(this).next();
            dom[0].style.display='block'
            getData($(this).attr("titleid"), this)
            if ($(this).next().css("height") == "0px") {
                $(this).next().animate({ height: '9rem' }, 100)
                $(this).parent().siblings("ul").children(".shop-li").animate({ height: '0' }, 200)
            } else {
                $(this).next().animate({ height: '0px' }, 200)
                let dom=$(this).next();
                dom[0].style.display='none'
            }

        })
    }).catch((err) => {
        console.log(err);
    });

    function getData(titleid, that) {
        $.ajax({
            type: "get",
            url: "http://chst.vip:1234/api/getcategory",
            data: { titleid: titleid }

        }).then(res => {
            var arr = res.result;
            let html = ""
            arr.forEach(item => {
                html += `
                    <li class="list" categoryid=${item.categoryId} title=${item.category}> 
                       ${item.category}
                    </li>
                `
            })
            $(that).next().children(".shopList").html(html);
            $(".list").click(function() {
                let categoryId = $(this).attr("categoryid")
                let category = $(this).attr("title")
                location.href = `./bijia.html?title=${category}&categoryId=${categoryId}`
            })
        }).catch(err => {
            console.log(err);
        })
    }

})